<template>
	<view>
		<view>
			<view class="" style="display: flex; margin-top: 40rpx; padding: 20rpx;">
				<view class="">
					<image style="width: 300rpx; height: 300rpx;" :src="studentInfo.stuPhoto" mode=""></image>
				</view>
				<view
					style="margin-left: 50rpx; width:500rpx; display: flex; flex-direction: column; justify-content: space-around;">
					<view style="display: flex; width: 400rpx;">
						<view class="character">宿舍号</view>
						<view class="character">{{studentInfo.dormitoryName}}</view>
					</view>
					<view style="display: flex; width: 400rpx;">
						<view class="character">姓名</view>
						<view class="character">{{studentInfo.studentName}}</view>
					</view>
					<view style="display: flex; width: 400rpx;">
						<view class="character">性别</view>
						<view class="character">{{studentInfo.sex == 0 ?"男" :"女"}}</view>
					</view>
					<view style="display: flex; width: 400rpx;">
						<view class="character">班级</view>
						<view class="character">{{studentInfo.className}}</view>
					</view>
					<view style="display: flex; width: 400rpx;">
						<view class="character">联系电话</view>
						<view class="character">{{studentInfo.phone}}</view>
					</view>
					<view style="display: flex; width: 400rpx;">
						<view class="character">班主任</view>
						<view class="character">{{studentInfo.teacherName}}</view>
					</view>
					<view style="display: flex; width: 400rpx;">
						<view class="character">班主任电话</view>
						<view class="character">{{studentInfo.teacherPhone}}</view>
					</view>
				</view>
			</view>
			<view style="margin-top: 80rpx; width: 100%; display: flex; align-items: center;padding: 40rpx; ">
				<view style="width: 30%; height: 5rpx; background-color: #ddd;" class=""></view>
				<view style="padding: 40rpx;">补卡照片</view>
				<view style="width: 30%; height: 5rpx; background-color: #ddd;" class=""></view>
			</view>
			<view style="display: flex;">
				<uni-file-picker style="transform: translateX(35%);" limit="1" @delete="deletePhoto" @select="select"
					file-mediatype="image" v-model="imageValue"></uni-file-picker>
			</view>

			<view style="display: flex; margin-top: 50rpx;justify-content:space-around;">
				<view class="cancel" @click="toUncheck">取消</view>
				<view class="tijiao" @click="submit">提交</view>
			</view>
		</view>
	</view>
</template>

<script>
	import taskNotReturned from "@/api/modules/taskNotReturned.js"
	export default {
		data() {
			return {
				bzrUrl: "/pages/managementTeacher/unCheckedStudents/unCheckedStudents",
				topName: "补卡",
				userName: "",
				imageValue: [],
				studentInfo: {},
				mendCardPhoto: "",
				buildNo: "",
				date: "",
			}
		},
		methods: {
			toUncheck() {
				uni.navigateTo({
					url: `/pages_main/managementTeacher/unCheckedStudents/unCheckedStudents?build=${this.buildNo}&date=${this.date}&flag=1`
				})
			},
			select(e) {
				uni.uploadFile({
					url: uni.url + 'common/uploadFile', //仅为示例，非真实的接口地址
					filePath: e.tempFilePaths[0],
					name: 'file',
					formData: {
						'user': 'test',
					},
					header: {
						Authorization: "Bearer " + uni.getStorageSync("token"),
					},
					success: (uploadFileRes) => {
						console.log(uploadFileRes)
						this.mendCardPhoto = JSON.parse(uploadFileRes.data).data
						console.log(this.mendCardPhoto)
					}
				});
			},
			submit() {
				if (!this.mendCardPhoto) {
					uni.showToast({
						title: "请上传图片",
						icon: "none"
					})
					return
				}
				console.log(123)
				taskNotReturned.updateStudentSdAttence({
					id: this.id,
					mendCardPhoto: this.mendCardPhoto,
					attenceStatus: "1"
				}).then(res => {
					console.log(res)
					uni.navigateTo({
						url: "/pages_main/managementTeacher/unCheckedStudents/unCheckedStudents"
					})
					this.imageValue = []
				})
			},
			deletePhoto(e) {
				this.mendCardPhoto = ""
			}

		},
		onLoad(options) {
			this.buildNo = options.buildNo
			this.date = options.date
			this.bzrUrl =
				`/pages/managementTeacher/unCheckedStudents/unCheckedStudents?buildNo=${this.buildNo}&date=${this.date}&flag=1`
			this.userName = uni.getStorageSync("userName")
			this.id = options.id
			taskNotReturned.getStudentById(options.studentId).then(res => {
				this.studentInfo = res.data
			})
		}
	}
</script>

<style scoped>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.indexContent {
		height: 100vh;

	}

	.character {
		width: 150rpx;
		font-size: 28rpx;
		color: #000;
	}

	.cancel {
		width: 35%;
		background-color: #a0a0a0;
		padding: 20rpx;
		text-align: center;
		border-radius: 10rpx;
		color: #fff;
		font-size: 40rpx;
		box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 3px 1px;
	}

	.tijiao {
		width: 35%;
		background-color: #ff009a;
		padding: 20rpx;
		text-align: center;
		border-radius: 10rpx;
		color: #fff;
		font-size: 40rpx;
		box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 3px 1px;
	}
</style>